<template>
    <div class="update-gender">
        <van-picker title="性别" show-toolbar :columns="columns" :default-index="defaultGender" @confirm="onConfirm"
            @cancel="onCancel" />
    </div>
</template>

<script>
import { updateUserProfile } from '../../../api/user'

export default {
    name: 'UpdateGender',
    model: {
        prop: 'userGender',
        event: 'changeGender'
    },
    props: {
        userGender: {
            type: Number,
            required: true
        }
    },
    data() {
        return {
            columns: ['男', '女'],
            defaultGender: this.userGender
        }
    },
    methods: {
        async onConfirm(value, index) {
            console.log(value);
            this.$toast.loading({
                message: '加载中...',
                forbidClick: true,
                duration: 0
            });
            try {
                await updateUserProfile({
                    gender: index
                })
                this.$emit('close')
                this.$emit('changeGender', index)
                this.$toast.success('更新性别成功')
            } catch (err) {
                // console.log('修改用户信息失败', err);
                this.$toast.success('更新性别失败')
            }
        },
        onCancel() {
            this.$emit('close')
        },
    },
}
</script>

<style>
</style>